﻿@inherits BootstrapComponentBase

<div @ref="@ThemeElement" class="theme">
    <div class="btn btn-theme" data-bs-toggle="tooltip" title="@Title" data-bs-placement="left">
        <div class="theme-bar">
            <span class="theme-color bg-danger"></span>
            <span class="theme-color bg-success"></span>
        </div>
        <div class="theme-bar">
            <span class="theme-color bg-info"></span>
            <span class="theme-color bg-warning"></span>
        </div>
    </div>

    <div class="theme-list">
        <div class="theme-header">
            <div>@HeaderText</div>
            <span class="theme-close" aria-hidden="true">&times;</span>
        </div>
        @foreach (var item in Themes)
        {
            <div class="@GetThemeItemClass(item)" @onclick="@(e => OnClickTheme(item))">
                @item.Text
            </div>
        }
    </div>
</div>
